<template>
  <div style="padding: 0 17px">
    <Breadcrumb/>
    <div style="display: flex;margin-top: 20px;">
      <el-button type="primary" style="margin-right: 15px" @click="addItem">新增
      </el-button>
      <el-select
          @change="load"
          v-model="this.selectedState"
          placeholder="选择状态"
          style="width: 200px;margin-right: 15px"
          clearable
      >
        <el-option
            v-for="item in stateOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
        />
      </el-select>
      <span style="min-width: 200px;margin-right: 15px">
          <OrganizationTree
              @change="load"
              @tree-select-changed="treeSelectChanged"
              v-model="selectedOrganizationId"
          />
        </span>
      <el-input v-model="search" placeholder="请输入SIM卡Id"
                style="width: 200px;height: 33px;margin-right: 15px;font-size: 13px;" clearable></el-input>
      <el-select
          @change="load"
          v-model="this.deviceBindingState"
          placeholder="绑定设备状态"
          style="width: 200px;margin-right: 15px"
          clearable
      >
        <el-option
            v-for="item in bindOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
        />
      </el-select>
      <el-button type="primary" style="color: #fff;font-size: 12px;background-color: #1890ff;" @click="load">搜索
      </el-button>
      <el-button type="success" style="" @click="importData">导入</el-button>
      <el-button type="success" style="" @click="exportData">导出</el-button>
    </div>
    <el-table :data="tableData" :row-class-name="tableRowClassName" :row-style="{ height: '77px' }" border style="width: calc(100vw - 240px);margin-top: 20px;height: 70vh;color: #909399;font-size: 15px;">
      <el-table-column prop="id" label="ID" width="100"/>
      <el-table-column prop="operatorName" label="操作员" width="150"/>
      <el-table-column prop="simId" label="simId" width="150"/>
      <el-table-column prop="clientName" label="单位名称" width="150"/>
      <el-table-column prop="dataPackage" label="套餐" width="150"/>
      <el-table-column prop="state" label="状态" align="center" width="90">
        <template #default="scope">
          <el-tag type="primary" v-if="scope.row.state === '0'">未开卡</el-tag>
          <el-tag type="success" v-else-if="scope.row.state === '1'">正常</el-tag>
          <el-tag type="danger" v-else-if="scope.row.state === '2'">锁定</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="manufactor" label="厂家" width="auto"/>
      <el-table-column prop="manufactorPhone" label="厂家电话" width="150"/>
      <el-table-column prop="inputTime" label="入库时间" width="180"/>
      <el-table-column prop="startTime" label="激活日期" width="180"/>
      <el-table-column prop="dataPackage" label="套餐" width="180"/>
      <el-table-column prop="time" label="有效日期" width="180"/>
      <el-table-column prop="organizationName" label="组织" width="300"/>
      <el-table-column align="center" label="操作" fixed="right" width="180">
        <template v-slot="scope">
          <el-button type="primary" size="small" icon="Edit" @click="editItem(scope.row)">编辑</el-button>
          <el-button type="danger" size="small" icon="Delete" @click="deleteItem(scope.row.id)">删除</el-button>
          <el-button v-if="scope.row.state==='1'" type="primary" size="small" icon="Edit" @click="logoutCard(scope.row)">注销</el-button>
          <el-button v-if="scope.row.state==='0'||scope.row.state==='2'" type="primary" size="small" icon="Edit" @click="openCard(scope.row)">开卡</el-button>
          <el-button v-if="scope.row.deviceBindingEquipment===0" :disabled="scope.row.state==='2'" type="primary" size="small" icon="Edit" @click="bindingEquipment(scope.row)">绑定</el-button>
          <el-button v-else type="primary" size="small" icon="Edit" @click="unbindingEquipment(scope.row)">解绑</el-button>

        </template>
      </el-table-column>
    </el-table>
    <el-pagination
        :current-page="currentPage"
        :page-size="pageSize"
        :page-sizes="[10, 20, 30, 50]"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
        :background="true"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
    />
    <el-dialog :close-on-click-modal="false" title="SIM卡操作" v-model="operationItemDialog" :show-close="false" width="700">
      <el-form label-position="left" label-width="78" :inline="true" :model="form" ref="form" :rules="rules">
        <el-form-item label="SIM卡Id" prop="simId">
          <el-input placeholder="请输入SIM卡Id" v-model="form.simId" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="单位名称" prop="clientId">
          <el-select style="width: 220px" v-model="form.clientId" filterable placeholder="选择单位名称">
            <el-option
                    v-for="item in clientOptions"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="状态"  prop="state">
          <el-select
              :disabled="isEdit"
              v-model="form.state"
              placeholder="请选择状态"
              style="width: 220px"
          >
            <el-option
                v-for="item in stateOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
            />
          </el-select>
        </el-form-item>
<!--        -->
        <el-form-item label="设备类型"  prop="deviceBindingType">
          <el-select
                  v-model="form.deviceBindingType"
                  placeholder="请选择设备类型"
                  style="width: 220px"
                  @change="deviceBindingTypeChange"
          >
            <el-option
                    v-for="item in deviceBindingTypeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
          </el-select>
        </el-form-item>
        <!--<el-form-item v-if="form.state!=='2'" label="选择设备" prop="equipmentInputStoreId">-->
          <!--<el-select style="width: 190px"  v-model="form.equipmentId" filterable placeholder="请选择设备">-->
            <!--<el-option v-if="form.deviceBindingType === 0"-->
                       <!--v-for="item in equipmentOptions"-->
                    <!--:key="item.id"-->
                    <!--:label="item.equipmentId"-->
                    <!--:value="item.id">-->
            <!--</el-option>-->
            <!--<el-option v-if="form.deviceBindingType === 1"-->
                    <!--v-for="item in videoDeviceOptions"-->
                    <!--:key="item.id"-->
                    <!--:label="item.deviceId"-->
                    <!--:value="item.id">-->
            <!--</el-option>-->
          <!--</el-select>-->
        <!--</el-form-item>-->
        <el-form-item v-if="form.state!=='2'" label="选择设备" prop="equipmentInputStoreId">
          <el-dropdown trigger="click" style="width: 220px">
            <el-select v-model="form.equipmentId" ref="selectRef1" placeholder="请选择设备" :visibleChange="closeSelect" :focus="closeSelect">
            </el-select>
            <template v-if="form.deviceBindingType === 0" #dropdown>
              <el-input  v-model="searchSim" placeholder="请输入设备识别码"
                         style="margin: 5px;width: 200px;height: 33px;font-size: 13px;" clearable></el-input>
              <el-dropdown-menu v-if="form.deviceBindingType === 0" style="width: 200px">
                <el-dropdown-item

                    v-for="option in equipmentOptions"
                    :value="option.id"
                    :label="option.equipmentId"
                    @click="selectedEquipment(option)">
                  {{option.equipmentId}}</el-dropdown-item>
              </el-dropdown-menu>
              <div style="display: flex;margin: 0 auto;max-width: 80px">
                <el-pagination
                    small
                    @size-change="innerHandleSizeChange"
                    @current-change="innerHandleCurrentChange"
                    :current-page="equipmentCurrentPage"
                    :page-size="equipmentPageSize"
                    layout="prev, pager, next, "
                    :total="equipmentTotal"
                >
                </el-pagination>
              </div>
            </template>
            <template v-if="form.deviceBindingType === 1" #dropdown>
              <el-input  v-model="searchSim" placeholder="请输入设备编号"
                         style="margin: 5px;width: 200px;height: 33px;font-size: 13px;" clearable></el-input>
              <el-dropdown-menu v-if="form.deviceBindingType === 1" style="width: 200px">
                <el-dropdown-item
                        v-for="option in videoDeviceOptions"
                        :value="option.id"
                        :label="option.deviceId"
                        @click="selectedVideoDevice(option)">
                  {{option.deviceId}}</el-dropdown-item>
              </el-dropdown-menu>
              <div style="display: flex;margin: 0 auto;max-width: 80px">
                <el-pagination
                        small
                        @size-change="innerHandleSizeChange"
                        @current-change="innerHandleCurrentChange"
                        :current-page="equipmentCurrentPage"
                        :page-size="equipmentPageSize"
                        layout="prev, pager, next, "
                        :total="videoDeviceTotal"
                >
                </el-pagination>
              </div>
            </template>
          </el-dropdown>
        </el-form-item>
        <el-form-item label="厂家"  prop="manufactor">
          <el-input placeholder="请输入联系方式" size="default" v-model="form.manufactor" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="厂家电话" prop="manufactorPhone">
          <el-input placeholder="请输入厂家电话" v-model="form.manufactorPhone" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="组织&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" prop="organization">
          <OrganizationTree
              v-model="form.organization"
          />
        </el-form-item>
        <el-form-item v-if="form.state==='1'" style="width: 290px" label="激活日期" prop="startTime">
          <el-date-picker
                  v-model="form.startTime"
                  type="datetime"
                  value-format="YYYY-MM-DD HH:mm:ss"
                  placeholder="选择激活日期"
          />
        </el-form-item>
        <el-form-item v-if="form.state==='1'" label="套餐" prop="dataPackage">
          <el-input placeholder="请输入套餐" v-model="form.dataPackage" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item v-if="form.state==='1'" style="width: 290px" label="有效日期" prop="time">
          <el-date-picker
              v-model="form.time"
              type="datetime"
              value-format="YYYY-MM-DD HH:mm:ss"
              placeholder="选择有效日期"
              :shortcuts="shortcuts"
          />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="reset('form')">取 消</el-button>
        <el-button type="primary" @click="submitForm('form')">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog :close-on-click-modal="false" title="绑定设备" v-model="operationBindDialog" :show-close="false" width="700">
      <el-form label-position="right"  :inline="true" :model="form" ref="bindForm" :rules="bindForm">
        <el-form-item label="设备类型"  prop="deviceBindingType">
          <el-select
                  v-model="form.deviceBindingType"
                  placeholder="请选择设备类型"
                  style="width: 220px"
          >
            <el-option
                    v-for="item in deviceBindingTypeOptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="选择设备" prop="equipmentInputStoreId">
          <el-dropdown trigger="click" style="width: 200px">
            <el-select v-model="form.equipmentId" ref="selectRef2" placeholder="请选择设备" :visibleChange="closeSelect" :focus="closeSelect">
            </el-select>
            <template #dropdown>
              <el-input  v-model="searchSim" placeholder="请输入设备识别码"
                        style="margin: 5px;width: 200px;height: 33px;font-size: 13px;" clearable></el-input>
              <el-dropdown-menu style="width: 200px">
                <el-dropdown-item
                    v-for="option in equipmentOptions"
                    :value="option.id"
                    :label="option.equipmentId"
                    @click="selectedEquipment(option)">
                  {{option.equipmentId}}</el-dropdown-item>
              </el-dropdown-menu>
              <div style="display: flex;margin: 0 auto;max-width: 80px">
                <el-pagination
                    small
                    @size-change="innerHandleSizeChange"
                    @current-change="innerHandleCurrentChange"
                    :current-page="equipmentCurrentPage"
                    :page-size="equipmentPageSize"
                    layout="prev, pager, next, "
                    :total="equipmentTotal"
                >
                </el-pagination>
              </div>
            </template>
          </el-dropdown>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="reset('bindForm')">取 消</el-button>
        <el-button type="primary" @click="bind('bindForm')">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog :close-on-click-modal="false" title="开卡" v-model="operationOpenCardDialog" :show-close="false" width="700">
      <el-form label-position="right"  :inline="true" :model="form" ref="openCardForm" :rules="openCardForm">
        <el-form-item label="套餐" prop="dataPackage">
          <el-input placeholder="请输入套餐" v-model="form.dataPackage" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item style="width: 290px" label="有效日期" prop="time">
          <el-date-picker
              v-model="form.time"
              type="datetime"
              value-format="YYYY-MM-DD HH:mm:ss"
              placeholder="选择有效日期"
              :shortcuts="shortcuts"
          />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="reset('openCardForm')">取 消</el-button>
        <el-button type="primary" @click="submitOpenCardForm('openCardForm')">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog title="导入" v-model="dialogImportVisible" width="520px">
      <el-form label-position="right" label-width="100px">
        <el-form-item label="模板下载:" padding-top:10px>
          <el-button type="primary" size="small" style="" @click="exportTemplate">SIM卡列表</el-button>
        </el-form-item>
        <el-form-item label="文件" padding-top:-20px>
          <el-upload :headers="headers"
                           :multiple="false"
                     :on-success="onUploadSuccess"
                     :on-error="onUploadError"
                     :action="serverIp+'/sim-input-store/importData'"
                     class="upload-demo">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传xlsx文件</div>
          </el-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogImportVisible = false">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import request from "@/utils/request.js";
import OrganizationTree from "@/components/OrganizationTree.vue";
import Breadcrumb from "@/components/Breadcrumb.vue";
import {serverIp} from "../../../public/static/config"
export default {
  name: "SIMList",
  components: {Breadcrumb, OrganizationTree},
  watch: {
    searchSim(){
      if (this.form.deviceBindingType!==undefined&&this.form.deviceBindingType!==null){
        if (this.form.deviceBindingType===0){
          this.getEquipmentOptions()
        }
        if (this.form.deviceBindingType===1){
          this.getVideoDeviceOptions()
        }
      }
    }
  },
  data() {
    return {
      serverIp,
                headers: {
                    token:  JSON.parse(localStorage.getItem('user')).token,
                },
      dialogImportVisible: false,
      shortcuts: [
        {
          text: '一个月后',
          value: () => {
            const date = new Date();
            date.setMonth(date.getMonth() + 2);
            return date;
          },
        },
        {
          text: '半年后',
          value: () => {
            const date = new Date();
            date.setMonth(date.getMonth() + 6);
            return date;
          },
        },
        {
          text: '一年后',
          value: () => {
            const date = new Date();
            date.setFullYear(date.getFullYear() + 1);
            return date;
          },
        }
      ],
      userInformation:JSON.parse(localStorage.getItem("user")),
      stateOptions:[
        {
          value:"0",
          label:"未开卡"
        },{
          value:"1",
          label:"正常"
        },{
        value:"2",
        label:"锁定"
      }],
      bindOptions:[
        {
          value:"0",
          label:"未绑定设备"
        },{
          value:"1",
          label:"已绑定设备"
        },
      ],
      deviceBindingTypeOptions:[
        {
          value: 0,
          label:"信息传输装置"
        },{
          value: 1,
          label:"监控设备"
        },
      ],
      equipmentOptions:[],
      videoDeviceOptions:[],
      selectOptionName: '',
      clientOptions:[],
      deviceBindingState:'',
      currentData:{},
      treeData:[],
      selectedState:'',
      selectedOrganizationId:JSON.parse(localStorage.getItem("user")).organization,
      selectedRole:"",
      search: '',     // 搜索框
      searchSim:"",
      tableData: [],  // 表单
      currentPage: 1,
      pageSize: 10,
      total: 0,
      equipmentCurrentPage:1,
      equipmentPageSize:10,
      equipmentTotal:0,
      videoDeviceTotal:0,
      operationOpenCardDialog: false,
      operationBindDialog: false,
      operationItemDialog: false,  // 弹窗
      form: {},        // 编辑Sim信息赋值
      rules: {
        simId: [
          {required: true, message: '请输入SIM卡Id', trigger: 'blur'},
        ],
        state: [
          {required: true, message: '请选择状态', trigger: 'blur'},
        ],
        organization: [
          {required: true, message: '请选择组织', trigger: 'blur'},
        ],
        clientId: [
          {required: true, message: '请选择单位名称', trigger: 'blur'},
        ],
        // manufactor: [
        //   {required: true, message: '请输入厂家', trigger: 'blur'},
        // ],
        // manufactorPhone: [
        //   {required: true, message: '请输入厂家电话', trigger: 'blur'},
        // ],
      },
      bindForm: {
        equipmentInputStoreId: [
          {required: true, message: '请选择绑定设备', trigger: 'blur'},
        ]
      },
      openCardForm:{
        dataPackage:[
          {required: true, message: '请输入套餐', trigger: 'blur'},
        ],
        time:[
          {required: true, message: '请选择有效日期', trigger: 'blur'},
        ]
      },
      isEdit:false,
    }
  },
  mounted() {
    // 初始化加载用户数据
    this.load()
    this.getClientOptions()
  },

  methods: {
    tableRowClassName({row}) {
      if (row.isExpire === '1') {
        // 后面的css样式
        return 'warning-row';
      } else if (row.isExpire === '0') {
        return '';
      }
      return '';
    },
    importData() {
      this.dialogImportVisible = true;
    },
    onUploadSuccess() {
      this.$message.success('上传成功');
      this.dialogImportVisible = false;
      location.reload();
    },
    onUploadError(){
      this.$message.error('上传失败');
    },
    // 模板下载
    exportTemplate() {
      window.location.href = '../xlsx/simList.xlsx'
    },
    exportData() {
      let level = JSON.parse(localStorage.getItem("user")).level
      if (this.currentData.level!==undefined){
        level=this.currentData.level
      }
      let deviceBindingEquipment =''
      if (this.deviceBindingState!==''){
        deviceBindingEquipment=this.deviceBindingState
      }
      let isAllClient = this.userInformation.isAllClient;
      let clientIds;
      if (isAllClient === "1") {
        clientIds = Object.values(this.userInformation.clientIds);
      } else {
        clientIds = [];
      }
      window.open(serverIp + '/sim-input-store/export?SIMId=' + this.search +
      "&organizationId="+this.selectedOrganizationId+"&level="+level+"&state="+this.selectedState+"&deviceBindingEquipment="+deviceBindingEquipment+"&isAllClient="+isAllClient+"&clientIds="+clientIds);
    },
    getClientOptions(){
      let level = JSON.parse(localStorage.getItem("user")).level
      let organizationId = JSON.parse(localStorage.getItem("user")).organization
      let isAllClient = JSON.parse(localStorage.getItem("user")).isAllClient;
      let clientIds;
      if (isAllClient === "1") {
        clientIds = JSON.parse(localStorage.getItem("user")).clientIds;
      } else {
        clientIds = [];
      }
      request.get("/client/listbyName?name="+this.selectOptionName+"&organizationId="+organizationId+"&level="+level+"&isAllClient="+isAllClient+"&clientIds="+clientIds).then(res=>{
        this.clientOptions=res.data
      })
    },
    // 搜索及初始化
    load() {
      let level = JSON.parse(localStorage.getItem("user")).level
      if (this.currentData.level!==undefined){
        level=this.currentData.level
      }
      let deviceBindingEquipment =''
      if (this.deviceBindingState!==''){
        deviceBindingEquipment=this.deviceBindingState
      }
      let isAllClient = this.userInformation.isAllClient;
      let clientIds;
      if (isAllClient === "1") {
        clientIds = Object.values(this.userInformation.clientIds);
      } else {
        clientIds = [];
      }
      request.get("/sim-input-store/page?SIMId=" + this.search + "&pageNum=" + this.currentPage + "&pageSize=" + this.pageSize +
                      "&organizationId="+this.selectedOrganizationId+"&level="+level+"&state="+this.selectedState+"&deviceBindingEquipment="+deviceBindingEquipment+"&isAllClient="+isAllClient+"&clientIds="+clientIds).then(res => {
        if (res.code === '200') {
          for (let key in res.data) {
            if (key === "record") {
              this.tableData = res.data[key];
            } else if (key === "total") {
              this.total = res.data[key];
            }
          }
        } else {
          this.$message.error("错误" + res.msg)
        }
      })
    },
    // 新增SIM
    addItem(){
      this.operationItemDialog = true
    },
    // 编辑SIM
    editItem(scope) {
      this.isEdit=true;
      Object.assign(this.form,scope)
      this.operationItemDialog = true
    },
    deviceBindingTypeChange(){
      // 信息传输装置
      if (this.form.deviceBindingType===0){
        this.getEquipmentOptions()
      }
      // 监控设备
      if (this.form.deviceBindingType===1){
        this.getVideoDeviceOptions()
      }
    },
    // 获取要绑定的设备列表
    getEquipmentOptions() {
      let level = JSON.parse(localStorage.getItem("user")).level
      let organizationId = JSON.parse(localStorage.getItem("user")).organization
      let isAllClient = JSON.parse(localStorage.getItem("user")).isAllClient;
      let clientIds;
      if (isAllClient === "1") {
        clientIds = JSON.parse(localStorage.getItem("user")).clientIds;
      } else {
        clientIds = [];
      }
      request.get("/equipment-input-store/findNoBindingSIM?pageNum="+this.equipmentCurrentPage+"&pageSize="+this.equipmentPageSize+"&equipmentId="+this.searchSim+"&organizationId="+organizationId+"&level="+level+"&isAllClient="+isAllClient+"&clientIds="+clientIds).then(res => {
        for (let key in res.data) {
          if (key === "record") {
            this.equipmentOptions = res.data[key];
          }
          if (key === "total") {
            this.equipmentTotal = res.data[key];
          }
        }
      })
    },
    getVideoDeviceOptions() {
      let level = parseInt(JSON.parse(localStorage.getItem("user")).level)
      let organizationId = parseInt(JSON.parse(localStorage.getItem("user")).organization)
      let isAllClient = parseInt(JSON.parse(localStorage.getItem("user")).isAllClient)
      let clientIds;
      if (isAllClient === "1") {
        clientIds = JSON.parse(localStorage.getItem("user")).clientIds;
      } else {
        clientIds = [];
      }
      request.get("/video-device/findNoBindingSIM?pageNum="+this.equipmentCurrentPage+"&pageSize="+this.equipmentPageSize+"&deviceId="+this.searchSim+"&organizationId="+organizationId+"&level="+level+"&isAllClient="+isAllClient+"&clientIds="+clientIds).then(res => {
        for (let key in res.data) {
          if (key === "record") {
            this.videoDeviceOptions = res.data[key];
            console.log(this.videoDeviceOptions)
          }
          if (key === "total") {
            this.videoDeviceTotal = res.data[key];
          }
        }
      })
    },
    // 选择绑定设备
    selectedEquipment(option){
      this.form.equipmentInputStoreId=option.id
      this.form.equipmentId=option.equipmentId
    },
    selectedVideoDevice(option){
      this.form.equipmentInputStoreId=option.id
      this.form.equipmentId=option.deviceId
    },
    // 解绑
    unbindingEquipment(option){
      Object.assign(this.form,option)
      this.form.equipmentInputStoreId=""
      request.post("/sim-input-store/updateDeviceBindingSim",this.form).then(res=>{
        if (res.code==='200'){
          this.$message.success("成功")
          this.load()
        }else {
          this.$message.error(res.msg)
        }
      })
    },
    // 绑定
    bindingEquipment(option){
      this.getEquipmentOptions()
      Object.assign(this.form,option)
      this.operationBindDialog=true;
    },
    // 开卡
    openCard(option){
      Object.assign(this.form,option)
      this.operationOpenCardDialog=true;
    },
    // 注销
    logoutCard(option){
      Object.assign(this.form,option)
      this.form.state="2"
      this.form.equipmentInputStoreId=""
      request.post("/sim-input-store/updateState",this.form).then(res=>{
        if (res.code==='200'){
          this.$message.success("成功")
          this.load()
          this.reset(val)
        }else {
          this.$message.error(res.msg)
        }
      })
    },
    // 开卡提交
    submitOpenCardForm(val){
      this.form.state="1"
      this.$refs[val].validate((valid) => {
        if (valid) {
          request.post("/sim-input-store/edit",this.form).then(res=>{
            if (res.code==='200'){
              this.$message.success("成功")
              this.load()
              this.reset(val)
            }
          })
        }
      })
    },
    // 编辑、新增确定按钮
    submitForm(val) {
      this.form.operatorId=JSON.parse(localStorage.getItem("user")).id
      this.$refs[val].validate((valid) => {
        if (valid) {
          request.post("/sim-input-store/edit", this.form).then(res => {
            if (res.code === '200') {
              this.$message({
                message: "成功",
                type: "success"
              })
              this.load()
              this.reset(val)
              this.clearConditions()
            } else {
              this.$message.error("操作失败" + res.msg)
            }
          })
        }
      })
    },
    bind(val){
      this.$refs[val].validate((valid) => {
        if (valid) {
          request.post("/sim-input-store/updateDeviceBindingSim", this.form).then(res => {
            if (res.code === '200') {
              this.$message({
                message: "成功",
                type: "success"
              })
              this.load()
              this.reset(val)
              this.clearConditions()
            } else {
              this.$message.error("操作失败" + res.msg)
            }
          })
        }
      })
    },
    // 清空查询条件
    clearConditions(){
      this.selectedState=""
      this.selectedOrganizationId=JSON.parse(localStorage.getItem("user")).organization;
      this.search="";
      this.deviceBindingState=""
    },
    reset(val) {
      this.isEdit=false;
      this.operationItemDialog = false;
      this.operationBindDialog = false;
      this.operationOpenCardDialog=false;
      this.form = {};
      this.$refs[val].clearValidate();
    },
    // 删除确定弹窗
    deleteItem(scope) {
      this.$confirm('是否确定删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        request.delete("/sim-input-store/delete/" + scope).then(res => {
          if (res.code === '200') {
            this.$message.success("成功")
            this.load()
          } else {
            this.$message.error(res.msg)
          }
        })
      });
    },
    treeSelectChanged(data) {
      this.currentData = data
    },
    handleSizeChange(pageSize) {   // 改变当前每页的个数触发
      this.pageSize = pageSize
      this.load()
    },
    handleCurrentChange(pageNum) {  // 改变当前页码触发
      this.currentPage = pageNum
      this.load()
    },
    innerHandleSizeChange(pageSize) {   // 改变当前每页的个数触发
      this.equipmentPageSize = pageSize
      this.getEquipmentOptions()
    },
    innerHandleCurrentChange(pageNum) {  // 改变当前页码触发
      this.equipmentCurrentPage = pageNum
      this.getEquipmentOptions()
    },
    // 关闭下拉框的选项
    closeSelect(){
      this.$refs["selectRef1"].blur();
      this.$refs["selectRef2"].blur();
    },
  }
}
</script>

<style scoped>
  :deep(.el-table .warning-row) {
    color: black;
    background-color: rgba(241, 126, 85, 0.5) !important;
  }

:deep(.el-table th .cell) {
  font-weight: 700
}
</style>
